<div class="ltag__user-subscription-tag" data-author-username=<%= author_username %>>
  <div class="ltag__user-subscription-tag__container">

    <div class="ltag__user-subscription-tag__content w-100">

      <div class="ltag__user-subscription-tag__profile-images signed-out">

        <span class="crayons-avatar crayons-avatar--xl ltag__user-subscription-tag__author-profile-image m-auto">
          <img class="crayons-avatar__image ltag__user-subscription-tag__author-profile-image m-0" src=<%= author_profile_image %> <%= author_username %> <%= author_username %>>
        </span>

        <span class="crayons-avatar crayons-avatar--xl ltag__user-subscription-tag__subscriber-profile-image m-auto">
          <img class="crayons-avatar__image ltag__user-subscription-tag__subscriber-profile-image m-0" alt="">
        </span>

      </div>

      <h2 class="ltag__user-subscription-tag__cta-text fs-xl mt-0 mb-4 align-center">
        <%= cta_text %>
      </h2>

      <div class="ltag__user-subscription-tag__subscription-area align-center">
        <div class="ltag__user-subscription-tag__signed-out">
          <div class="fs-base mb-2">
            <%= t("views.liquids.user_subscription.logged_out", community: community_name) %>
          </div>
          <a href="/enter" class="c-cta c-cta--default">
            <%= t("views.liquids.user_subscription.sign_in") %>
          </a>
        </div>

        <div class="ltag__user-subscription-tag__signed-in hidden">
          <button class="crayons-btn mb-4">
            <%= t("views.liquids.user_subscription.subscribe.button") %>
          </button>
          <div class="ltag__user-subscription-tag__logged-in-text fs-s mb-3">
            <%= t("views.liquids.user_subscription.subscribe.desc_html", community: community_name, update: link_to(t("views.liquids.user_subscription.subscribe.update"), "/settings")) %>
          </div>
        </div>

        <div class="ltag__user-subscription-tag__apple-auth fs-s hidden">
          <button disabled class="crayons-btn"><%= t("views.liquids.user_subscription.subscribe.apple.button") %></button>
          <div class="fs-s">
            <%= t("views.liquids.user_subscription.subscribe.apple.desc_html", community: community_name, update: link_to(t("views.liquids.user_subscription.subscribe.apple.update"), "/settings")) %>
          </div>
        </div>

        <div class="ltag__user-subscription-tag__response-message crayons-notice fs-base w-100 hidden" aria-live="polite"></div>
      </div>
    </div>
    <div class="user-subscription-confirmation-modal hidden">
      <div class="crayons-modal__box__body">
        <p class="fs-base mb-4 mt-0">
          <%= t("views.liquids.user_subscription.confirm.text_html", community: community_name, username: tag.span(author_username, class: "ltag__user-subscription-tag__author-username fw-medium")) %>
        <p>
        <div class="ltag__user-subscription-tag__confirmation-buttons">
          <button class="ltag__user-subscription-tag__confirmation-btn crayons-btn mr-1">
            <%= t("views.liquids.user_subscription.confirm.button_text") %>
          </button>
          <button class="ltag__user-subscription-tag____cancel-btn crayons-btn crayons-btn--secondary">
            <%= t("views.liquids.user_subscription.confirm.cancel_text") %>
          </button>
        </div>
      </div>
    </div>
  </div>
</div>
